<template>
  <transition :name="transitionName">
    <keep-alive>
      <router-view class="page-has-transition"></router-view>
    </keep-alive>
  </transition>
</template>

<script>
import { bus } from '@/common/plugin/index.js'
import { commonApi } from '@/common/api/commonApi.js'
import { Version } from './config'
import { bridge } from '@/common/plugin/utils/bridge.js'
import { CanUpdate } from '@/common/utils'

export default {
  name: 'App',
  data() {
    return {
      transitionName: 'yt-slider-left'
    }
  },
  created() {
    commonApi.searchFirst('sys_apkManage', { descending: 'updatedAt' }).then((res) => {
      // 服务器上最新版本与当前app版本做比较
      let canUpdate = CanUpdate(Version, res.version)
      if (canUpdate) {
        this.$Confirm({
          confirmText: '立即下载',
          cancelText: '容我想想',
          title: '发现新版本',
          desc: res.describe
        }).then(
          () => {
            this.$Toast('已在后台下载，稍后更新！', 'success')
            bridge.DownloadApk(res.file[0].name, res.file[0].url, (res) => {
              console.log(res)
            })
          }
        )
      }
    })

    bus.$on('onBack', () => {
      this.$router.$back()
    })
  },
  destroyed() {
    bus.$off('onBack')
    bus.$off('onResume')
  },
  watch: {
    $route(to, from) {
      if (to.meta.name) {
        this.transitionName = to.meta.name
      } else {
        this.transitionName = this.$router.$isBack
          ? 'yt-slider-left'
          : 'yt-slider-right'
      }
    }
  }
}
</script>
<style lang="stylus">
@import './style/index.styl'

.page-has-transition
  position absolute
  top 0
  left 0
  width 100%
  height 100%
</style>
